<template>
  <div class="project-info">
    <div class="project-info-title">基础信息</div>
    <div class="project-info-tb">
      <form-detail :columns="columns" :data="info" border labelWidth="188px"></form-detail>
    </div>
  </div>
</template>

<script>
export default {
  name: 'project-info',
  data() {
    return {
      columns: [
        {label: '项目简称', prop: 'xmjc'},
        {label: '项目地点', prop: 'xmdd'},
        {label: '投资类型', prop: 'tzlx'},
        {label: '工程类型', prop: 'gclx'},
        {label: '建设用地许可证号', prop: 'jsydxkzh'},
        {label: '建设工程许可证号', prop: 'jsgcxkzh'},
        {label: '所在分区', prop: 'szfq'},
        {label: '项目状态', prop: 'xmzt'},
        {label: '工程用途', prop: 'gcyt'},
        {label: '建设性质', prop: 'jsxz'},
        {label: '立项级别', prop: 'lxjb'},
        {label: '立项文号', prop: 'lxwh'},
        {label: '总投资（万元）', prop: 'ztz'},
        {label: '总面积（m²）', prop: 'zmj'},
        {label: '总长度（m）', prop: 'zcd'},
        {label: '绿化面积(万m2)', prop: 'lhmj'},
        {label: '重点项目', prop: 'zdxm'},
        {label: '是否有地下管线', prop: 'sfydxgx'},
        {label: '开工日期', prop: 'kgrq'},
        {label: '竣工日期', prop: 'jgrq'},
        {label: '单体数量', prop: 'dtsl'},
        {label: '结构类型', prop: 'jglx'},
        {label: '最深基坑深度', prop: 'zsjksd'},
        {label: '最高建筑物高度', prop: 'zgjzgd'},
        {label: '扬尘监控点位', prop: 'ycjkdw'},
        {label: '安全员配置数量', prop: 'aqypzsl', span: 16},
        {label: '项目简介', prop: 'xmjj', span: 24, lines: 5}
      ],
      info: {
        xmjc: '蓝天产业园',
        xmdd: '华苑产业区环外',
        tzlx: '商业投资',
        gclx: '公建(房建)',
        jsydxkzh: '2010园区0077',
        jsgcxkzh: '12212025044002',
        szfq: '华苑区',
        xmzt: '在施',
        gcyt: '公共建筑',
        jsxz: '新建',
        lxjb: '市级',
        lxwh: '',
        ztz: '56874.8',
        zmj: '418020',
        zcd: '501.81',
        lhmj: '12000',
        zdxm: '是',
        sfydxgx: '是',
        kgrq: '2020/4/30',
        jgrq: '2025/4/30',
        dtsl: '3',
        jglx: '钢筋混凝土结构',
        zsjksd: '0',
        zgjzgd: '89',
        ycjkdw: '12',
        aqypzsl: '5',
        xmjj: ''
      }
    }
  }
}
</script>

<style lang="scss" scoped>
  .project-info {
    padding: 10px 30px;
    &-title {
      font-size: 26px;
      color: #EFFDFF;
      margin-bottom: 30px;
    }

    &-tb {
      ::v-deep {
        .form-detail {
          &-border {
            border-top: 1px solid #074A78;
            border-left: 1px solid #074A78;
          }

          .el-form-item {
            position: relative;
            margin-bottom: 0;
            border-bottom: 1px solid #074A78;
            border-right: 1px solid #074A78;
            background-color: #021542;
          }
          .el-form-item__label {
            color: #FFF;
            font-size: 20px;
          }
          .el-form-item__content {
            min-height: 33px;
            padding: 5px 10px;
            border-left: 1px solid #074A78;
            box-sizing: content-box;
            background: rgba(21,188,238, .1);
            color: #FFF;
            font-size: 20px;
          }
        }
      }
    }
  }
</style>
